<template>
	<view class="inventory">
		<NavBar title="库存盘点"/>
		<view class="inventory-list flex-column">
			<view class="item" v-for="(item, index) in inventoryList" :key="item.inventory_count_no">
				<div class="w-title align-center">
					<view class="no"> {{ item.inventory_count_no }} </view>
					<wd-tag :type="item.status == 1 ? 'success' : item.status == 0 ? 'danger' : 'warning'" mark>
						{{ item.status == 1 ? '正常' : item.status == 0 ? '异常' : '待盘库' }}
					</wd-tag>
				</div>
				<div class="w-info flex-column">
					<div class="goods-name"> 区域名称：{{ item.area_name }} </div>
					<div class="sku"> 商品名称：{{ item.product_name }} </div>
					<div class="sku"> 商品 sku：{{ item.sku_name }} </div>
					<div class="stock"> 商品库存：{{ item.system_quantity }} </div>
					<div class="stock"> 库存差异：{{ item.difference?item.difference:'0' }} </div>
				<!-- 	<div v-if="item.isEdit" class="warning-num"> 实际库存：<wd-input-number v-model="item.newNum" :min="0" /> </div>
					<div class="warning-num" v-else> 实际库存：{{ item.actual_quantity?item.actual_quantity:item.system_quantity }} </div> -->
					备注：<wd-textarea readonly no-border v-model="item.remark" auto-height placeholder="无备注信息" />
				</div>
				<div class="w-footer align-center">
					<wd-button v-if="!item.isEdit" size="small" @tap="inventoryList[index].isEdit = true"> 修改 </wd-button>
					<template v-else>
						<wd-button size="small" plain hairline type="info" @tap="inventoryList[index].isEdit = false"> 取消 </wd-button>
						<wd-button size="small" @tap="updateInventory(index)"> 确认 </wd-button>
					</template>
				</div>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	import NavBar from '@/components/NavBar.vue'
	import { inventoryCountApi } from '@/api'
	import { useUserStore } from '@/store'
	const inventoryList = ref([])
	const updateInventory = (i) => {
		const { userInfo } = useUserStore()
		const { newNum, inventory_count_no } = inventoryList.value[i]
		const params = {
			no: inventory_count_no,
			uid: userInfo.uid,
			actual_quantity: newNum
		}
		inventoryCountApi(params).then(res => {
			uni.showToast({
				icon: 'none',
				title: '修改成功'
			})
			getInventory()
		}).catch(err => {
			uni.showToast({
				icon: 'none',
				title: err.msg
			})
		})
	}
	// 获取盘点信息
	const getInventory = () => {
		const { userInfo } = useUserStore()
		inventoryCountApi({}, 'GET').then(res => {
			inventoryList.value = res
			inventoryList.value.forEach(item => {
				item.isEdit = false
				item.newNum =  item.actual_quantity?item.actual_quantity:item.system_quantity
			})
		})
	}
	onLoad(() => {
		getInventory()
	})
</script>

<style lang="scss" scoped>
	.inventory {
		padding: 20rpx 24rpx;
		.inventory-list {
			gap: 30rpx;
			.item {
				padding: 20rpx;
				border-radius: 20rpx;
				background-color: #fff;
				.w-title {
					margin-bottom: 20rpx;
					padding-bottom: 20rpx;
					border-bottom: 1px solid #eee;
					justify-content: space-between;
				}
				.w-info {
					gap: 20rpx;
					.wd-textarea {
						border: 1px solid #eee;
						border-radius: 20rpx;
						padding: 20rpx;
					}
				}
				.w-footer {
					margin-top: 20rpx;
					padding-top: 20rpx;
					justify-content: end;
					border-top: 1px solid #eee;
					.wd-button {
						height: 44rpx;
						margin-left: 30rpx;
					}
				}
			}
		}
	}
</style>
